.flex {
  display: flex;
  //align-items: center
}

.flex-column-center {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.flex-column-between {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}

.flex-column-around {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
}

.flex-center {
  display: flex;
  justify-content: center;
  align-items: center;
}

.flex-between {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.flex-around {
  display: flex;
  justify-content: space-around;
  align-items: center;
}

.flex-wrap {
  flex-wrap: wrap;

}

.flex-end {
  justify-content: flex-end;

}

.flex-start {
  justify-content: flex-start;

}

.align-start {
  align-self: flex-start;

}

.align-end {
  align-self: flex-end;

}

.flex-column {
  flex-direction: column;

}

.flex-align-start {
  align-items: flex-start;

}

.flex-align-end {
  align-items: flex-end;

}

.flex-align-baseline {
  align-items: baseline;

}

.flex1 {
  flex: 1;

}

.flex2 {
  flex: 2;

}

.flex3 {
  flex: 3;

}

.flex4 {
  flex: 4;

}

.flex5 {
  flex: 5;

}

.flex6 {
  flex: 6;

}

.flex7 {
  flex: 7;

}

.flex8 {
  flex: 8;

}